<template>
	<div>	
		<div class="photo-a">
			<router-link to="/detail"><i class="iconfont">&#xe613;</i></router-link>
			<span class="photo-b">景区图片</span>
		</div>		
		<ul class="photo">
			<router-link to="/detailImg">
				<li v-for="item of photoImg" :key="item.id">	
					<img :src="item.imgUrl" alt="">	
				</li>
			</router-link>
		</ul>
		
	</div>
</template>
<script>
	export default{
		data(){
			return{
				photoImg:[
					{
						id:"1",
						imgUrl:"http://img1.qunarzz.com/sight/p0/1411/18/a3e418d6b99a0fa62a3e94944b31f978.water.jpg_350x240_e0a8a356.jpg"
					},
					{
						id:"2",
						imgUrl:"http://img1.qunarzz.com/sight/p0/1411/67/91bf2b4f577f0b6ef22211d45129bb89.water.jpg_350x240_0c478893.jpg"
					},
					{
						id:"3",
						imgUrl:"http://img1.qunarzz.com/wugc/p95/201306/06/8152889c66df560a93835fbb.jpg_350x240_71984357.jpg"
					},
					{
						id:"4",
						imgUrl:"http://img1.qunarzz.com/sight/p0/1411/ff/492509bfa18c213ee76de8ec0d3426c6.water.jpg_350x240_dae917f1.jpg"
					},
					{
						id:"5",
						imgUrl:"http://img1.qunarzz.com/wugc/p229/201306/06/6ed06d507b3b0f3593835fbb.jpg_350x240_bea50e70.jpg"
					},
					{
						id:"6",
						imgUrl:"http://img1.qunarzz.com/sight/p0/1411/ff/492509bfa18c213ee76de8ec0d3426c6.water.jpg_350x240_dae917f1.jpg"
					}
				]
			}
		}
	}
</script>
<style scoped>
	.photo{
		padding: 1.08rem .2rem .4rem .2rem;
	    overflow: hidden;
	}
	.photo li{
		width: 50%;
	    float: left;
	    margin-bottom: .1rem;
	    box-sizing: border-box;
	    padding-right: .05rem;
	}
	.photo img{
		width:100%;
	}
	.photo-a{
		position: fixed;
	    width: 100%;
	    height: .88rem;
	    background: #fff;
	    z-index: 91;
	    border-bottom: 1px solid #e0e0e0;
	}
	.photo-a i{
		position: absolute;
	    font-size: .48rem;
	    color: #333;
	    text-align: center;
	    left: 0;
	    top: 0;
	    width: .8rem;
	    height: .88rem;
	    line-height: .88rem;
	}
	.photo-a span{
		overflow: hidden;
	    margin: 0 1rem;
	    line-height: .88rem;
	    white-space: nowrap;
	    text-overflow: ellipsis;
	    font-size: .32rem;
	    text-align: center;
	    color: #333;
	    position:absolute;
	    top:0;
	    left:25%;
	}
</style>